body{margin:0;user-select:none;width:1920px;height:1080px;overflow:hidden;transform-origin:left top;position:absolute}#home{flex-direction:column;background-size:100% 100%}#home,#menu-bar{display:flex;width:100%;height:100%;align-items:center}#menu-bar{flex-direction:row;margin-top:100px;justify-content:space-evenly}.game-img{object-fit:contain;cursor:pointer}#game-line-up{width:100%;height:100%;flex-direction:column;justify-content:center;background-size:100% 100%}#game-line-up,.line-up-top-bar{display:flex;align-items:center}.line-up-top-bar{width:1670px;height:420px;position:relative}.instrument-container{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);width:340px;height:280px;margin-top:61px;gap:13px}.stringed{margin-left:47px}.woodwind{margin-left:76px}.brass{margin-left:71px}.percussion{margin-left:67px}.instrument-item{width:100%;height:100%;min-width:0;min-height:0;overflow:hidden;display:flex;align-items:center;justify-content:center;box-sizing:border-box}.line-up-bottom-bar{position:relative;width:1810px;height:410px;background-repeat:no-repeat}.instrument-img{cursor:grab}#bassoon{top:21px;right:21px}#bassoon,#cello{position:absolute}#cello{top:193px;left:948px}#clarinet{position:absolute;top:101px;right:566px}#double_bass{position:absolute;top:19px;left:209px}#flute{position:absolute;top:157px;left:417px}#french_horn{position:absolute;top:200px;left:678px}#oboe{position:absolute;top:25px;left:21px}#snare_drum{position:absolute;top:67px;right:395px}#timpani{position:absolute;top:267px;right:292px}#triangle{position:absolute;top:205px;right:123px}#trombone{position:absolute;top:59px;left:427px}#trumpet{top:20px;right:697px}#trumpet,#tuba{position:absolute}#tuba{top:201px;left:74px}#viola{top:23px;left:701px}#viola,#violin{position:absolute}#violin{top:24px;right:152px}#xylophone{position:absolute;top:237px;left:249px}.line-up-function-btn-group{display:flex;flex-direction:row;align-items:center;justify-content:center;position:absolute;bottom:15px;gap:100px}.function-btn{cursor:pointer}.line-up-home-container{left:3%}.line-up-home-container,.line-up-info-container{object-fit:contain;position:absolute;bottom:1%;cursor:pointer}.line-up-info-container{right:3%}.good-sound-home-container{left:3%}.good-sound-home-container,.good-sound-info-container{object-fit:contain;position:absolute;bottom:3%;cursor:pointer}.good-sound-info-container{right:3%}.explain-dialog{display:flex;justify-content:center;align-items:center;position:absolute;width:100%;height:100%;top:50%;left:50%;transform:translate(-50%,-50%);z-index:100;background-color:rgba(0,0,0,.7)}.close-container{position:absolute;right:27%;top:25%;cursor:pointer}#game-good-sound{display:flex;width:100%;height:100%;flex-direction:column;align-items:center;justify-content:center;background-size:100% 100%}.good-sound-top-bar{position:relative;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(2,1fr);width:1755px;row-gap:15px;margin-top:-10px}.good-sound-container{position:relative;width:215px;height:225px;display:flex;flex-direction:column-reverse;align-items:center;justify-content:flex-end;background-size:100% 100%;padding:0 15px;box-sizing:border-box}.good-sound-container.answer{flex-direction:row;align-items:flex-start;padding-top:15px}.good-sound-selector{width:75%;object-fit:contain}.good-sound-title{text-align:center;font-size:24px;font-weight:700;font-family:Noto Sans TC;color:#000;margin-top:20px}.selector{width:180px;height:50px;color:#fff;font-size:24px;font-weight:700;font-family:sans-serif}.good-sound-arrow,.selector{position:absolute;bottom:15px;right:15px;cursor:pointer}.good-sound-arrow{width:20px;height:20px;pointer-events:none}.selector-display{position:absolute;bottom:0;left:0;width:110px;height:100%;display:flex;align-items:center;justify-content:center;user-select:none;pointer-events:none;margin-left:25px}.selector-dropdown{position:absolute;top:40px;right:0;width:100%;max-height:200px;overflow-y:auto;background-color:#fff;border:2px solid #ccc;border-radius:5px;box-shadow:0 2px 8px rgba(0,0,0,.2);z-index:1000}.selector-option{padding:8px 12px;text-align:center;cursor:pointer;font-size:28px;color:#333;border-bottom:1px solid #eee;transition:background-color .2s}.selector-option:hover{background-color:#f0f0f0}.selector-option:last-child{border-bottom:none}.good-sound-bottom-bar{position:relative;width:1670px;height:173px;background-size:100% 100%;margin-top:50px}.good-sound-function-btn-group{flex-direction:row;bottom:35px;gap:100px}.good-sound-function-btn-group,.good-sound-play-container{display:flex;align-items:center;justify-content:center;position:absolute}.good-sound-play-container{width:96px;height:96px;cursor:pointer}.good-sound-play-container:first-child{top:22px;left:22px}.good-sound-play-container:nth-child(2){top:52px;left:124px}.good-sound-play-container:nth-child(3){top:22px;left:226px}.good-sound-play-container:nth-child(4){top:52px;left:328px}.good-sound-play-container:nth-child(5){top:22px;left:430px}.good-sound-play-container:nth-child(6){top:52px;left:532px}.good-sound-play-container:nth-child(7){top:22px;left:634px}.good-sound-play-container:nth-child(8){top:52px;left:736px}.good-sound-play-container:nth-child(9){top:22px;left:838px}.good-sound-play-container:nth-child(10){top:52px;left:940px}.good-sound-play-container:nth-child(11){top:22px;left:1042px}.good-sound-play-container:nth-child(12){top:52px;left:1144px}.good-sound-play-container:nth-child(13){top:22px;left:1246px}.good-sound-play-container:nth-child(14){top:52px;left:1348px}.good-sound-play-container:nth-child(15){top:22px;left:1450px}.good-sound-play-container:nth-child(16){top:52px;left:1552px}.good-sound-play,.good-sound-play-hover{position:absolute}.good-sound-play-container span{position:absolute;font-size:20px;font-weight:700;color:#00599b;font-family:sans-serif;z-index:10;margin-top:45px}.good-sound-description{position:relative;color:#000;font-size:16px;text-align:left}.good-sound-description-title{text-align:center;font-weight:700;margin-bottom:3px}